html{
	width:100%;
	height:100%;
}
body {
	/* Location of the image */
	/*background-image: url(http://www.gironafm.cat/img/backdesktop.jpg);*/
	background-image: url(../../img/bg_directe.jpg);
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
	background-color: #;
}

.logo { margin-bottom: 10px; }

div#container{
	display: inline-flex;
  height: 100vh;
}

#verticalButton{
  margin: auto 0;
  text-align: center;
  width:100vw;
}

.play, .pause{
 	cursor: pointer;
}

.jp-no-solution{
	color:#FFF;
	padding: 7px;
	background-color: #000;
	width: auto;
	font-size: 1.1em;
}
img.play:hover, img.pause:hover { opacity: 0.7; }

/* For mobile devices */
@media only screen and (max-width: 767px)  {
  body {
    /* The file size of this background image is 93% smaller
     * to improve page load speed on mobile internet connections */
    /*background-image: url(http://www.gironafm.cat/img/backmobile.jpg);*/
    background-image: url(../../img/bg_directe.jpg);
     background-position: center center;
  }
  img.play, img.pause { width: 10%; }
}


@media only screen and (max-width: 490px) {
	body{
  /*background-image: url(http://www.gironafm.cat/img/backmobile.jpg);*/
  background-image: url(../../img/bg_directe.jpg);
   background-position: center center;
	}
  img.play, img.pause { width: 25%; }
}


@media only screen and (max-width: 490px) and (orientation: portrait) {
	body{
  /*background-image: url(http://www.gironafm.cat/img/backmobile.jpg);*/
  background-image: url(../../img/bg_directe.jpg);
   background-position: center center;
	}
  img.play, img.pause {	width: 30%;	}
  #container { display: table; }
  img.logo { width: 80%; margin-bottom: 25px; }
}


@media only screen and (max-width:340px) and (orientation: portrait) {
	body{
  /*background-image: url(http://www.gironafm.cat/img/backmobile.jpg);*/
  background-image: url(../../img/bg_directe.jpg);
   background-position: center center;
	}
  img.play, img.pause{ width: 30%; }
}